<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="../../libs/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" type="text/css" href="../../libs/app.css" />
		<link href="../../css/main.css" rel="stylesheet" />
		<link href="../../css/select-work.css" rel="stylesheet" />
	</head>

	<body>
		<div class="head">
			<img src="../../images/all-left.png" alt="" class="mui-action-back">
			<p>选择等级</p>
		</div>
		<div class="content sel-rank">
			<div class="rank" id="rank">
				<!--<div class="item-rank">
					<div class="item-l">
						<p class="rank-d">铜</p>
						<p class="count">次数：<span>33</span>次</p>
					</div>
					<div class="item-r">
						<p class="money-rank">￥<span class="money">44</span>
							<img class="select-img" src="../../images/rank-select@2x.png" />
						</p>
					</div>
				</div>-->

				<!--<p><span class="roll"></span> &nbsp;&nbsp;银
					<span class="money-rank">￥</span>
					<span class="count">次数：</span></p>
				<p><span class="roll"></span> &nbsp;&nbsp;金
					<span class="money-rank">￥</span>
					<span class="count">次数：</span></p>-->
			</div>
			<div class="button">
				<button id="fill">提交订单</button>
			</div>
		</div>

		<script src="../../libs/mui.min.js"></script>
		<script src="../../js/jquery-3.1.1.min.js"></script>
		<script src="../../js/url.js"></script>
		<script type="text/javascript">
			//获取等级信息列表
			$.ajax({
				type: "get",
				url: ur + "rest/loanPartnerController/rankinfo",
				async: true,
				headers: {
					'X-Token': localStorage.token
				},
				data: {
					loanCode: localStorage.loanCode
				},
				dataType: 'json',
				success: function(data) {
					if(data.meta.code === 'S002') {
						var list = data.data;
						var rank = ['', '铜牌', '银牌', '金牌']
						for(var i = 0; i < list.length; i++) {
							var item = '<div class="item-rank"  rank=' +
								list[i].rank + ' ids=' +
								list[i].id + '><div class="item-l"><p class="rank-d" >' +
								rank[list[i].rank] + '</p><p class="count">次数：<span>' +
								list[i].number + '</span>次</p></div><div class="item-r"><p class="money-rank">￥<span class="money">' +
								list[i].money + '</span></p></div></div>';
							$('#rank').append(item);
						}
						var imgSel = '<img class="select-img" src="../../images/rank-select@2x.png" />'
						//选择样式
						$('#rank').on('tap', '.item-rank', function() {
							localStorage.rank = $(this).attr('rank');
							if($(this).find('.select-img').length==1) {
								$(this).find('.select-img').remove()
							} else {
								$(this).find('.money-rank').append(imgSel);
								$(this).siblings().find('.select-img').remove()
							}
						})
					} else {
						mui.toast(data.meta.message);
					}
				}
			});

			//提交选择等级
			$('#fill').on('tap', function() {
				if($('.select-img').length === 0 || localStorage.rank === '') {
					mui.toast('请选择等级');
				} else { //向支付页面传递级别id和支付信息，根据业务类型的级别交加盟费
					localStorage.carid = $('.select-img').parents('.item-rank').attr('ids'); //级别id
					localStorage.sureallprice = $('.select-img').siblings().text().replace('￥', '') //金额;
					localStorage.setItem('select-rank-href-sure-mine','../helper/sure-mine.html');
					href(localStorage.getItem('select-rank-href-sure-mine'), 'sure-mine.html');
				}
			})
		</script>
	</body>

</html>